import { Match, Matcher, MicroAppProvider, Outlet } from "@web-design/micro-app"
import { AppProvider } from "@web-design/ui"
import request from "./utils/request"
import { publicPath } from "./utils/env"
import routes from "./routes"
import MainLayout from "./layout/MainLayout"
import React from "react"
import ReactDOM from "react-dom"
const App = () => {
    return <AppProvider
        apiPrefix=""
        request={request}>
        <MicroAppProvider

            publicPath={publicPath}
            routes={routes as any} name={""}>
            <Matcher>
                <Match path="*" element={<MainLayout />} />
                <Match path="/login/*" element={<Outlet />} />
            </Matcher>
        </MicroAppProvider>
    </AppProvider>

}

// const root = ReactDOM.createRoot(document.getElementById("root"));
// root.render(React.createElement(App));
ReactDOM.render(<App />, document.getElementById('root'))